<template>
	<view class="cardstyle">
		<slot name="header"></slot>
		<view class="titlebox">
			 <view class="imgbox" >
				 <image src="/static/logo.png" v-if="mode==2" style="height: 50px;width: 60px;"></image>
			</view>
			
		<view><text class="titlebox">{{title}}</text></view>
		</view>
		<view class="tipsbox" >
			
			<text  v-if="isTop" style="color: #f00;padding-right: 8px;font-weight: 600;">置顶</text>
			<text style="color: darkgrey;padding-right: 8px;" >{{author}}</text>
			<text style="color: darkgrey;">{{comments}}评</text>
			<view  class="time" style="flex:1;display: flex;justify-content: flex-end;">
				<text >{{time}}</text>
			</view>
		</view>
		<slot name="tips"></slot>
		<slot name="footer"></slot>
	</view>
</template>

<script>
	export default {
		name:"CardView",
		data() {
			return {
				
			};
		},
		props:{	
			mode:{
				type:Number,
				default:2,
				required:true
			},
			title:{
				type:String,
				default:"新闻标题",
				required:true
			},
			isTop:{
				type:Boolean,
				default:false,
				required:true
			},
			author:{
				type:String,
				default:"来源",
				required:true
			},
			comments:{
				type:Number,
				default:0,
				required:true
			},
			time:{
				type:String,
				default:"2025.1.1"
			}
			 
		},
		
	}
</script>

<style>
.cardstyle{
	background-color: #e6f7ff;
	border-radius: 8px;
padding-top:8px;
padding-left: 8px;
}
.titlebox{
	display: flex;
	flex-direction:row ;
}
.tipsbox{
margin-top: 5px;
font-size: 20rpx;
padding-bottom: 10px;
width: 330px;
display: flex;
justify-content: space-between;
}	
.time{
	color: darkgray;
}
</style>